package com.noocodecommit.wicket.jquery.plugin.ui.sortable;

import java.util.ArrayList;

import org.apache.wicket.ajax.AjaxRequestTarget;
import org.apache.wicket.markup.html.basic.Label;
import org.apache.wicket.markup.html.list.ListItem;
import org.apache.wicket.markup.html.list.ListView;
import org.apache.wicket.model.Model;

import com.noocodecommit.wicket.jquery.TemplatePage;
import com.noocodecommit.wicket.stuff.jquery.JQCore;
import com.noocodecommit.wicket.stuff.jquery.plugin.chili.JQChili;
import com.noocodecommit.wicket.stuff.jquery.plugin.ui.sortable.JQSortable;
import com.noocodecommit.wicket.stuff.jquery.plugin.ui.sortable.JQSortableOptions;
import com.noocodecommit.wicket.stuff.jquery.plugin.ui.sortable.JQSortableUtils;
import com.noocodecommit.wicket.stuff.jquery.plugin.ui.sortable.OnSortReceiveBehavior;
import com.noocodecommit.wicket.stuff.jquery.plugin.ui.sortable.OnSortStartBehavior;
import com.noocodecommit.wicket.stuff.jquery.plugin.ui.tabs.JQTabs;

public class SortablePage extends TemplatePage
{

	private static final long serialVersionUID = 1L;
	private final JQTabs tabContainer;

	public SortablePage()
	{
		super();
		JQCore.init(this);
		this.setupChili();

		tabContainer = new JQTabs("tab-container");
		tabContainer.setOutputMarkupId(true);
		add(tabContainer);

		/*************************************************************************************************************************************************************************************************************************************************
		 * Simple Selectable
		 ************************************************************************************************************************************************************************************************************************************************/
		JQSortable sortable0 = JQSortableUtils.create("sortable0").forcePlaceholderSize(true).tolerance(JQSortableOptions.TOLERANCE_INTERSECT).build();
		tabContainer.add(sortable0);

		/*************************************************************************************************************************************************************************************************************************************************
		 * Ajax Selectable #1
		 ************************************************************************************************************************************************************************************************************************************************/
		JQSortable sortable1 = JQSortableUtils.create("sortable1").forcePlaceholderSize(true).build();

		ArrayList<String> list1 = new ArrayList<String>();
		list1.add("Cat");
		list1.add("Dog");
		list1.add("Bird");
		list1.add("Crocodile");
		list1.add("Murloc");
		sortable1.add(new ListView("item1", list1)
		{
			protected void populateItem(ListItem item)
			{
				item.add(new Label("content1", item.getModel()));
				item.setOutputMarkupId(true);
			}
		});
		tabContainer.add(sortable1);

		final Label output1 = new Label("output1");
		output1.setOutputMarkupId(true);
		tabContainer.add(output1);

		sortable1.add(new OnSortStartBehavior()
		{
			public void onStart(AjaxRequestTarget target)
			{
				String msg = String.format("sorting item '%s'", ((JQSortable) this.getComponent()).getItem().getModelObjectAsString());
				output1.setModel(new Model(msg));
				target.addComponent(output1);
			}
		});

		/*************************************************************************************************************************************************************************************************************************************************
		 * Ajax Selectable #2
		 ************************************************************************************************************************************************************************************************************************************************/
		JQSortable sortable2 = JQSortableUtils.create("sortable2").forcePlaceholderSize(true).build();

		ArrayList<String> list2 = new ArrayList<String>();
		list2.add("Cat");
		list2.add("Dog");
		list2.add("Bird");
		list2.add("Crocodile");
		list2.add("Murloc");

		sortable2.add(new ListView("item2", list2)
		{
			protected void populateItem(ListItem item)
			{
				item.add(new Label("content2", item.getModel()));
				item.setOutputMarkupId(true);
			}
		});
		tabContainer.add(sortable2);

		JQSortable sortable3 = JQSortableUtils.create("sortable3").forcePlaceholderSize(true).build();

		ArrayList<String> list3 = new ArrayList<String>();
		list3.add("Butterfly");
		list3.add("Lion");
		list3.add("Parrot");
		list3.add("Wolf");
		list3.add("Tiger");
		sortable3.add(new ListView("item3", list3)
		{
			protected void populateItem(ListItem item)
			{
				item.add(new Label("content3", item.getModel()));
				item.setOutputMarkupId(true);
			}
		});
		tabContainer.add(sortable3);

		final Label output2 = new Label("output2");
		output2.setOutputMarkupId(true);
		tabContainer.add(output2);

		sortable2.getOptions().setConnectWith("'#" + sortable3.getMarkupId() + "'");
		sortable3.getOptions().setConnectWith("'#" + sortable2.getMarkupId() + "'");

		sortable2.add(new OnSortReceiveBehavior()
		{
			public void onReceive(AjaxRequestTarget target)
			{
				String msg = String.format("'%s' received item '%s' from '%s'", ((JQSortable) this.getComponent()).getMarkupId(), ((JQSortable) this.getComponent()).getItem().getModelObjectAsString(), ((JQSortable) this.getComponent()).getSender()
						.getMarkupId());
				output2.setModel(new Model(msg));
				target.addComponent(output2);
			}
		});

		sortable3.add(new OnSortReceiveBehavior()
		{
			public void onReceive(AjaxRequestTarget target)
			{
				String msg = String.format("'%s' received item '%s' from '%s'", ((JQSortable) this.getComponent()).getMarkupId(), ((JQSortable) this.getComponent()).getItem().getModelObjectAsString(), ((JQSortable) this.getComponent()).getSender()
						.getMarkupId());
				output2.setModel(new Model(msg));
				target.addComponent(output2);
			}
		});

		JQChili chili1 = new JQChili("chili1");
		add(chili1);
		this.bindChiliCode(chili1, this.getClass(), "html");

		JQChili chili2 = new JQChili("chili2");
		add(chili2);
		this.bindChiliCode(chili2, this.getClass(), "java");

		JQCore.get().bindOnDocumentReadyFunction();
	}
}
